<!--

    Copyright (c) 2015-2018 Red Hat, Inc.
    All rights reserved. This program and the accompanying materials
    are made available under the terms of the Eclipse Public License v1.0
    which accompanies this distribution, and is available at
    http://www.eclipse.org/legal/epl-v10.html

    Contributors:
      Red Hat, Inc. - initial API and implementation

-->
<che-toolbar che-title="All factories" border-none></che-toolbar>
<che-description che-link-title="Learn more." che-link="/docs/factories-getting-started.html">
  Factories enable workspace automation and are packaged as a consumer-friendly URL. Create new Factories to onboard your team, or integrate
  with your toolchain.
</che-description>
<md-content md-scroll-y flex layout="column" md-theme="maincontent-theme" class="factories-list-factories">
  <div class="progress-line">
    <md-progress-linear ng-show="listFactoriesCtrl.isLoading" md-mode="indeterminate"></md-progress-linear>
  </div>
  <md-content flex class="md-maincontent-theme-theme">
    <che-list-header che-input-placeholder="Search"
                     id="seach-factory-input"
                     che-search-model="listFactoriesCtrl.factoriesFilter.name"
                     che-on-search-change="listFactoriesCtrl.onSearchChanged(str)"
                     che-hide-search="listFactoriesCtrl.factories.length === 0"
                     che-add-button-title="Create Factory"
                     che-add-button-href="#/factories/create-factory"
                     che-delete-button-title="Delete"
                     che-on-delete="listFactoriesCtrl.deleteSelectedFactories()"
                     che-hide-delete="listFactoriesCtrl.cheListHelper.isNoItemSelected"
                     che-hide-header="listFactoriesCtrl.cheListHelper.visibleItemsNumber === 0">
      <div flex="100"
           layout="row"
           layout-align="start stretch"
           class="che-list-item-row">
        <div layout="column" layout-gt-xs="row"
             layout-align="start center"
             class="che-checkbox-area">
          <div layout="row" layout-align="center center" class="che-list-item-checkbox-main">
            <md-checkbox class="che-list-item-checkbox"
                         aria-label="Factory list"
                         ng-checked="listFactoriesCtrl.cheListHelper.areAllItemsSelected"
                         ng-click="listFactoriesCtrl.cheListHelper.changeBulkSelection()"></md-checkbox>
          </div>
        </div>
        <div flex hide-xs layout-gt-xs="row"
             layout-align="start center"
             class="che-list-item-details">
          <che-list-header-column flex-gt-xs="25"
                                  che-sort-value='listFactoriesCtrl.factoriesOrderBy'
                                  che-sort-item='[name, id]'
                                  che-column-title='Factory'></che-list-header-column>
          <che-list-header-column flex-gt-xs="60"
                                  che-sort-value='listFactoriesCtrl.factoriesOrderBy'
                                  che-sort-item='workspace.environments[0].machines[0].limits.ram'
                                  che-column-title='RAM'></che-list-header-column>
          <che-list-header-column flex-gt-xs="15"
                                  che-column-title='Actions'></che-list-header-column>
        </div>
      </div>
    </che-list-header>
    <che-list ng-show="listFactoriesCtrl.cheListHelper.visibleItemsNumber > 0">
      <cdvy-factory-item
              ng-repeat="factory in listFactoriesCtrl.cheListHelper.getVisibleItems() | orderBy:listFactoriesCtrl.factoriesOrderBy"
              cdvy-factory="factory"
              cdvy-is-selectable="true"
              ng-model="listFactoriesCtrl.cheListHelper.itemsSelectionStatus[factory.id]"
              cdvy-on-checkbox-click="listFactoriesCtrl.cheListHelper.updateBulkSelectionStatus()"></cdvy-factory-item>
    </che-list>
    <div class="paging-buttons-area" ng-if="listFactoriesCtrl.isPagination()">
      <md-button
              ng-disabled="!listFactoriesCtrl.hasPreviousPage()"
              ng-click="listFactoriesCtrl.fetchFactoriesPage('first');">
        <span><<</span>
      </md-button>
      <md-button
              ng-disabled="!listFactoriesCtrl.hasPreviousPage()"
              ng-click="listFactoriesCtrl.fetchFactoriesPage('prev');">
        <span><</span>
      </md-button>
      <md-button disabled>
        <span>{{listFactoriesCtrl.pagesInfo.currentPageNumber}}</span>
      </md-button>
      <md-button
              ng-disabled="!listFactoriesCtrl.hasNextPage()"
              ng-click="listFactoriesCtrl.fetchFactoriesPage('next');">
        <span>></span>
      </md-button>
      <md-button
              ng-disabled="!listFactoriesCtrl.hasLastPage()"
              ng-click="listFactoriesCtrl.fetchFactoriesPage('last');">
        <span>>></span>
      </md-button>
    </div>
    <div class="che-list-empty">
        <span ng-show="listFactoriesCtrl.factories.length > 0 && listFactoriesCtrl.visibleItemsNumber === 0">
          No factories found.
        </span>
      <span ng-show="listFactoriesCtrl.factories.length === 0">There are no factories.</span>
    </div>
  </md-content>
</md-content>
